<template>
  <div>
    <AModal
      v-bind="$attrs"
      width="800px"
      :body-style="{ padding: '0px' }"
      @close="modalEvent('close')"
      @ok="modalEvent('ok')"
      @open="modalEvent('open')"
      @cancel="modalEvent('cancel')"
    >
      <AScrollbar style="max-height: calc(100vh - 170px); overflow: auto; padding: 20px">
        <AForm ref="formRef" :model="form" auto-label-width layout="vertical">
          <ARow :gutter="10">
            <ACol :span="12">
              <AFormItem
                field="assetName"
                label="设备名称"
                :rules="[{ required: true, message: '请输入设备名称' }]"
                :validate-trigger="['change', 'input', 'blur']"
              >
                <AInput v-model="form.assetName" placeholder="请输入设备名称"></AInput>
              </AFormItem>
            </ACol>
            <ACol :span="12">
              <AFormItem field="assetModel" label="型号">
                <AInput v-model="form.assetModel" placeholder="请输入型号"></AInput>
              </AFormItem>
            </ACol>
            <ACol :span="12">
              <AFormItem field="assetUnit" label="单位">
                <AInput v-model="form.assetUnit" placeholder="单位"></AInput>
              </AFormItem>
            </ACol>
            <ACol :span="12">
              <AFormItem field="assetQty" label="数量">
                <AInputNumber
                  v-model="form.assetQty"
                  model-event="input"
                  placeholder="数量"
                  hide-button
                  :precision="0"
                  :step="1"
                />
              </AFormItem>
            </ACol>
            <ACol :span="12">
              <AFormItem field="purchaseDate" label="购入日期">
                <ADatePicker v-model="form.purchaseDate" placeholder="购入日期" class="w100" />
              </AFormItem>
            </ACol>
            <ACol :span="12">
              <AFormItem field="assetAmt" label="预估金额">
                <AInputNumber
                  v-model="form.assetAmt"
                  model-event="input"
                  placeholder="金额"
                  hide-button
                  :precision="2"
                  :step="1"
                />
              </AFormItem>
            </ACol>
            <ACol>
              <AFormItem field="remark" label="备注">
                <ATextarea v-model="form.remark" placeholder="备注"></ATextarea>
              </AFormItem>
            </ACol>
          </ARow>
        </AForm>
      </AScrollbar>
    </AModal>
  </div>
</template>

<script lang="ts" setup>
import { Message } from '@arco-design/web-vue'
import { editFixedAssets, FixedAssetsReq, FixedAssetsResItem } from '@renderer/api/assetInventory'
import { useMenuState } from '@renderer/store'
import { deleteNullObject } from '@renderer/utils/data-processing'

interface Props {
  [key: string]: any
  checkData?: Partial<FixedAssetsResItem>
}
const props = withDefaults(defineProps<Props>(), {
  checkData: () => {
    return {}
  }
})
const emit = defineEmits(['update:visible', 'reload'])
const attrs = useAttrs()
const formRef = ref()
const form = ref<FixedAssetsReq>({
  assetName: '',
  assetModel: '',
  assetUnit: '',
  assetQty: 0,
  purchaseDate: '',
  assetAmt: 0,
  depreciationYear: 0,
  depreciationResidualValue: 0,
  remark: '',
  assetType: 1
})
const menuParam = useMenuState()

// 弹窗事件
const modalEvent = (type: string) => {
  switch (type) {
    case 'ok':
      formRef.value.validate((errors) => {
        console.log(errors)
        if (!errors) {
          // 新增
          if ((attrs.title as string).includes('新增')) {
            form.value.assetId = undefined
          }
          form.value.assetType = 1
          editFixedAssets(deleteNullObject(form.value)).then(() => {
            Message.success((attrs.title as string).includes('新增') ? '新增成功' : '修改成功')
            modalEvent('cancel')
            emit('reload')
          })
        }
      })
      break
    case 'close':
      menuParam.switchEditStatus(false)
      formRef.value.resetFields()
      emit('update:visible', false)
      break
    case 'open':
      Object.assign(form.value, props.checkData)
      menuParam.switchEditStatus(true)
      break
    case 'cancel':
      formRef.value.resetFields()
      emit('update:visible', false)
      menuParam.switchEditStatus(false)
      break
    default:
      break
  }
}
</script>
<style scoped></style>
